<template>
	<view>
		<view class="qualltyTesting_content_card" v-for="item in qualityTestList">
			<view class="qualltyTesting_content_top">
				<view class="qualltyTesting_content_top_left">
					{{ qualityTest[item.procedures] }}
				</view>
				<view class="qualltyTesting_content_top_right" @click="goAppeal(item)">{{ result[item.result] }}
				</view>
			</view>
			<view class="qualltyTesting_content_center">
				<view><span style="font-weight: bold;">商品名称</span>： {{ item.productInfo.productName ? item.productInfo.productName  : ' ' }}</view>
			</view>
			<view class="qualltyTesting_content_center">
				<view><span style="font-weight: bold;">质检编号</span>：  {{ item.testId ? item.testId : ' '}}</view>
			</view>
			<view class="qualltyTesting_content_center">
				<view><span style="font-weight: bold;">质检时间</span>： {{ item.createTime ? item.createTime : ' '}}</view>
			</view>
			<view class="qualltyTesting_content_bottom">
				<image :src="item.image" mode=""></image>
			</view>
			<view class="qualltyTesting_content_footer">
				<view></view>
				<view class="footer_right" @click="goDetail(item)">查看详情</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			qualityTestList: {
				type: Array,
				default: [],
			},
		},
		data() {
			return {
				// 质检的流程
				qualityTest: {
					1: '未开始',
					2: '质检中',
					3: '已完成',
				},
				// 质检结果
				result: {
					1: '合格',
					2: '不合格',
					3: '暂无结果',
				},
				// 申诉的状态
				isAppeal: {
					1: '可申诉',
					2: '申诉中',
					3: '申诉完成',
					4: '已取消',
				},
			}
		},
		methods: {
			// 去详情页
			goDetail(detail) {
				uni.navigateTo({
					url: `/pages/qualityTesting/qualityTestingDetail/qualityTestingDetail?goDetail=${JSON.stringify(detail)}`
				})
			},
			// 去申诉页面
			goAppeal(item) {
				if (item.isAppeal == "1") {
					uni.navigateTo({
						url: `/pages/qualityTesting/appeal/appeal`
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>


	.qualltyTesting_content_card {
		background-color: white;
		margin: 20rpx;
		border-radius: 10rpx;

		.qualltyTesting_content_top {
			display: flex;
			justify-content: space-between;
			padding: 20px 10px;

			.qualltyTesting_content_top_left {
				font-weight: bold;
				font-size: 18px;
			}

			.qualltyTesting_content_top_right {
				font-weight: bold;
				background-color: #fe5c2d;
				text-align: center;
				line-height: 20px;
				width: 80px;
				height: 20px;
				color: white;
				border-radius: 5px;
			}
		}

		.qualltyTesting_content_center {
			padding: 10px;
			line-height: 26px;
		}

		.qualltyTesting_content_bottom {
			padding-top: 20px;
			border-top: 1px solid #eee;
			display: flex;
			flex-wrap: wrap;
			height: 100px;

			image {
				width: 70px;
				height: 50px;
				margin-left: 20px;
				margin-bottom: 20px;
			}
		}

		.qualltyTesting_content_footer {
			display: flex;
			justify-content: space-between;

			.footer_right {
				margin: 10px;
				padding: 10px;
				border: 1px solid #fe5c2d;
				border-radius: 5px;
				color: #fe5c2d;

			}
		}
	}
</style>